const { override,
    fixBabelImports,
    addWebpackAlias,
    adjustStyleLoaders,
    overrideDevServer,
    // addLessLoader
} = require('customize-cra')
const path = require('path')
const webpack = require('webpack');
const paths = require('react-scripts/config/paths');
const { aliasDangerous, configPaths } = require('react-app-rewire-alias/lib/aliasDangerous');
const processDefine = Object.entries(process.env).reduce(
    (res, [key, value]) => ({
        ...res,
        [`process.env.${key}`]: JSON.stringify(value),
    }),
    {},
);
const devServerConfig = (_) => {
    const config = _;

    config.headers = {
        'Access-Control-Allow-Origin': '*',
    };
    config.historyApiFallback = true;
    config.hot = false;
    config.watchContentBase = false;
    config.liveReload = false;
    return config;
}
module.exports = {
    webpack: override(
        addWebpackAlias({
            "@": path.resolve(__dirname, "src"),
            "@com": path.resolve(__dirname, "src/components"),
            "@pages": path.resolve(__dirname, "src/pages"),
        }),
        fixBabelImports('import', {
            libraryName: 'antd',
            libraryDirectory: 'es',
            style: true,
        }),
        adjustStyleLoaders(rule => {
            if (rule.test.toString().includes("scss")) {
                rule.use.push({
                    loader: require.resolve("sass-resources-loader"),
                    options: {
                        resources: "./src/assets/scss/base/variables.scss" //这里是你自己放公共scss变量的路径
                    }
                });
            }
        }),
        // addLessLoader({
        //     lessOptions: {
        //         javascriptEnabled: true,
        //         modifyVars: { '@primary-color': '#f8711a' }
        //     }
        // }),
        (config) => {
            //修改、添加loader 配置 :
            // 所有的loaders规则是在config.module.rules(数组)的第二项
            // 即：config.module.rules[2].oneof  (如果不是，具体可以打印 一下是第几项目)
            // 修改 less 配置 ，规则 loader 在第7项(具体可以打印配置)
            const loaders = config.module.rules.find(rule => Array.isArray(rule.oneOf)).oneOf;
            loaders[7].use.push({
                loader: 'style-resources-loader',
                options: {
                    patterns: path.resolve(__dirname, 'src/assets/less/theme/variables.less')//全局引入公共的scss 文件
                }
            })
            // console.log(config)
            // 关闭sourceMap
            // config.devtool = false
            // 配置打包文件位置
            paths.appBuild = path.join(__dirname, './dist');
            config.output.path = paths.appBuild;
            // config.output.publicPath = './';
            config.plugins.push(new webpack.DefinePlugin(processDefine));
            // NOTE: 解决 create-react-app imports restriction outside of src directory 的限制
            aliasDangerous(configPaths('tsconfig.paths.json'))(config);
            return config
        }
    ),
    devServer: overrideDevServer(devServerConfig)
}